<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="jquery-3.3.1.min.js"></script>
<!--    browser-sync start --server --files "*.html"   -->
</head>
<body>
<button type="button" name="button">点击变红</button>
<p>1</p>
<p>2</p>
<p>3</p>
</body>
<script>
    //1.css选择器：以字符串的方式传入
    //2.传入一个DOM对象或者document，window对象给$()
    //3.传递一个html文本给$()，这时$()自动创建这个元素
    //4.传递一个函数给$() 常用
    $(function () {
        $("button").click(function () {
            $("p").css("color","red").hide(5000);
            $("<h3>php中文网</h3>").appendTo(document.body);
        });
    })

    // $(document).ready(function () {
    //     $("button").click(function () {
    //         $("p").css("color","red").hide(5000);
    //         $("<h3>php中文网</h3>").appendTo(document.body);
    //     });
    // })
</script>
</html>